import { Form, Input, Button, Table, Pagination, Popconfirm, message, Space, Select } from 'antd'
import './Tim.scss'
import { useEffect, useState } from 'react';
import http from '../../utils/http'
import store from '../../store/index'
const { Option } = Select;

const Contract_signing_management = () => {
    const [peodata, setPeodata] = useState([])
    const [form] = Form.useForm();
    let tabledata = store.zengjiayu.timdetailid
    let provide = { size: 10, current: 1, perId: tabledata.perId }
    const [total, setTotal] = useState(1)
    const [selectedRowKeys, setSelectedRowKeys] = useState([])
    const [current, setCurrent] = useState(1)
    useEffect(() => {
        console.log(tabledata.person_name)
        getdata()
    }, [])
    const getdata = () => [
        http({
            url: '/peree_Comments/findPersonByPerId',
            method: 'post',
            params: provide
        }).then((res) => {
            console.log(res)
            if (res.code == 200) {
                //对数据进行处理
                let arr = res.data.listPerson.map((v, i) => {
                    return {
                        key: v.personId,
                        personCreatime: getLocalTime(v.personCreatime),
                        personEaducation: v.personEaducation,
                        personName: v.personName,
                        personPhone: v.personPhone,
                        personPhoto: v.personPhoto,
                        personSex: v.personSex,
                        personType: v.personType,
                        personVx: v.personVx
                    }
                })
                setPeodata(arr);
                console.log(res.data)
                // sessionStorage.setItem('table', JSON.stringify(arr));
            }
        })
    ]
    //查询
    const search = () => {
        form.getFieldsValue(true).size = 10
        form.getFieldsValue(true).current = current
        form.getFieldsValue(true).perId = tabledata.perId
        provide = form.getFieldsValue(true)
        getdata()
    }
    function getLocalTime(nS) {
        let date = new Date(nS);
        //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        let y = date.getFullYear();
        let MM = date.getMonth() + 1;
        MM = MM < 10 ? "0" + MM : MM; //月补0
        let d = date.getDate();
        d = d < 10 ? "0" + d : d; //天补0
        // let h = date.getHours();
        // h = h < 10 ? "0" + h : h; //小时补0
        // let m = date.getMinutes();
        // m = m < 10 ? "0" + m : m; //分钟补0
        // let s = date.getSeconds();
        // s = s < 10 ? "0" + s : s; //秒补0
        // return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
        return y + "-" + MM + "-" + d;
    }
    const fenyeqi = (a, b) => {
        setCurrent(a)
        provide = { size: 10, current: a, perId: tabledata.perId }
        getdata()
    }
    //重置
    const resize = () => {
        provide = { size: 10, current: 1, perId: tabledata.perId }
        setSelectedRowKeys([])
        form.setFieldsValue({
            personName: "",
            personPhone: "",
            personType: ''
        })
        getdata()
    }
    const openEditBox = () => {

    }
    function cancel(e) {
    }
    function confirm(a, b) {
        var id = []
        id.push(b.key)

        http({
            url: '/peree_Comments/DeletePersonInfo',
            data: id,
            method: 'post',
        }).then((res) => {
            console.log(res)
            if (res.code == 200) {
                provide = { size: 10, current: current, perId: tabledata.perId }
                getdata()
                setSelectedRowKeys([])
                message.success('删除成功！');
            }
            else {
                message.error('删除失败！')
            }
        })
    }

    const columns = [
        {
            title: '人员姓名',
            dataIndex: 'personName',
            render: (text) => <a>{text}</a>,
        },
        {
            title: '联系方式',
            dataIndex: 'personPhone',
        },
        {
            title: '人员类型',
            dataIndex: 'personType',
        },
        {
            title: '绑定微信号',
            dataIndex: 'personVx',
        },
        {
            title: '性别',
            dataIndex: 'personSex',
        },
        {
            title: '学历',
            dataIndex: 'personEaducation',
        },
        {
            title: '注册时间',
            dataIndex: 'personCreatime',
        },
        {
            title: '操作',
            dataIndex: 'operation',
            render: (text, record) => (
                <Space size="middle">
                    <Popconfirm
                        title="确定要删除吗?"
                        onConfirm={() => { confirm(text, record) }}
                        onCancel={cancel}
                        okText="Yes"
                        cancelText="No"
                    >
                        <a href="#">删除</a>
                    </Popconfirm>
                </Space>
            ),
        },
    ];
    let newSelectData = []
    const rowSelection = {
        selectedRowKeys,
        onChange: (selectedRowKeys, selectedRows) => {
            setSelectedRowKeys(selectedRowKeys)
            console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
            newSelectData = [...selectedRows]
        },
        getCheckboxProps: (record) => ({
            // disabled: record.name === 'Disabled User',
            // Column configuration not to be checked
            name: record.name,
        }),
    };

    return <div>
        <div className='biao timpbiao'>
            <Form form={form} name="horizontal_login" layout="inline" className='Role'>
                <Form.Item
                    name="personName"
                    label='人员名称'
                ><Input placeholder='请输入人员名称' />
                </Form.Item>
                <Form.Item
                    name="personPhone"
                    label='联系方式'
                ><Input placeholder='请输入联系方式' />
                </Form.Item>
                <Form.Item
                    name="personType"
                    label='人员类型'
                >
                    <Select placeholder='请选择' className='select' style={{ width: 182 }}>
                        <Option value="0">负责人</Option>
                        <Option value="1">普通员工</Option>
                    </Select>
                </Form.Item>
                <Form.Item className='btn'>
                    <div>
                        <Button className='cha'
                            type="primary"
                            onClick={search}>查询</Button>
                        <Button className='resize' onClick={resize} type="primary">重置</Button>
                    </div>

                </Form.Item>
            </Form>
            <Table className='table1'
                rowSelection={{
                    ...rowSelection,
                }}
                columns={columns}
                dataSource={peodata}
                pagination={false}
            />
            <Pagination className='fenyeqi' onChange={fenyeqi} total={total} />

        </div>
    </div>
};

export default Contract_signing_management;